<template>
	<view class="fu-radio">
		<view class="fu-radio-item" :class="{active: item.dictValue==value}" v-for="(item,index) in options" :key="index" @click="change(item.dictValue)">
			<image v-if="value==item.dictValue" src="/static/img/common/checkbox-active.png" mode=""></image>
			<image v-else src="/static/img/common/checkbox-no.png" mode=""></image>
			<view>{{item.dictLabel}}</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: 'FuRadio',
		props: {
			value: [String, Number],
			options: {
				type: Array,
				default: ()=>[]
			}
		},
		methods: {
			change(value){
				this.$emit("input", value)
				this.$emit('change',value)
			}
		}
	}
</script>
<style lang="scss" scoped>
	.fu-radio{
		display: flex;
		align-items: center;
		.fu-radio-item{
			display: flex;
			align-items: center;
			margin-right: 48rpx;
			color: #999999;
			image{
				width: 32rpx;
				height: 32rpx;
				margin-right: 16rpx;
			}
			&:last-child{
				margin-right: 0;
			}
			&.active{
				color: #1f1f1f;
			}
		}
	}
</style>
